<template>
  <div>
    <!-- 排片计划 -->

    <span style="color: #3f9dff; font-weight: bold">{{
      roomInfo.cinema_name
    }}</span>
    的
    <span style="color: #3f9dff; font-weight: bold"
      >{{ roomInfo.cinema_room_name }}{{ roomInfo.cinema_room_type }}</span
    >排片计划列表
    <el-divider></el-divider>
    <el-table :data="form">
      <el-table-column label="电影名称" prop="title"></el-table-column>
      <el-table-column label="热映时间" prop="showingon_date"></el-table-column>
      <el-table-column label="场次" prop="showingon_time"></el-table-column>
      <el-table-column label="售价" prop="price"></el-table-column>
      <el-table-column label="是否已发布" prop="status">
        <template slot-scope="scope">
          <el-switch
            v-model="scope.row.status"
            :active-value="1"
            :inactive-value="0"
          ></el-switch>
        </template>
      </el-table-column>
      <el-table-column label="操作" prop="title">
        <template slot-scope="scope">
          <el-button
            size="small"
            type="danger"
            icon="el-icon-delete"
            circle
            @click="del(scope.row.plan_id)"
          ></el-button>
        </template>
      </el-table-column>
    </el-table>
  </div>
</template>

<script>
import httpApi from "@/http";
export default {
  data() {
    return {
      roomInfo: {}, //保存放映厅的基本信息
      form: [],
    };
  },
  methods: {
    // 删除排片计划
    del(planid) {
      this.$confirm("此操作将永久删除该排片计划, 是否继续?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          console.log(planid)
          let id = planid;
          httpApi.showingonPlanApi.delete({ id }).then((res) => {
            console.log(res);
            this.initPlanList();
          });
          this.$message({
            type: "success",
            message: "删除成功!",
          });
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消删除",
          });
        });
    },
    // 加载放映厅的基本信息
    initRoomData() {
      httpApi.cinemaRoomApi
        .queryById({ id: this.$route.params.roomId })
        .then((res) => {
          console.log(res);
          this.roomInfo = res.data.data;
        });
    },
    // 加载排片计划表
    initPlanList() {
      let params = this.$route.params.roomId;
      httpApi.showingonPlanApi
        .queryByRoomId({ room_id: params })
        .then((res) => {
          console.log('排片计划表',res);
          this.form = res.data.data;
        });
    },
  },

  mounted() {
    // 加载放映厅的基本信息
    this.initRoomData();
    // 加载排片计划表
    this.initPlanList();
  },
};
</script>

<style lang="scss" scoped>
</style>